<div
	class="flex items-center -mx-4 overflow-x-auto overflow-y-hidden sm:justify-center flex-nowrap"
	[ngClass]="['bg' + default, 'text' + defaultInv]"
>
	<a
		class="flex items-center flex-shrink-0 px-5 py-3 space-x-2 border-b"
		rel="noopener noreferrer"
		href="#"
		[ngClass]="['border' + plainInv, 'text' + plainInv]"
	>
		<svg
			xmlns="http://www.w3.org/2000/svg"
			class="w-4 h-4"
			viewBox="0 0 24 24"
			fill="none"
			stroke="currentColor"
			stroke-width="2"
			stroke-linecap="round"
			stroke-linejoin="round"
		>
			<path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path>
		</svg>
		<span>Architecto</span>
	</a>
	<a
		class="flex items-center flex-shrink-0 px-5 py-3 space-x-2 border border-b-0 rounded-t-lg"
		rel="noopener noreferrer"
		href="#"
		[ngClass]="['border' + plainInv, 'text' + contrastInv]"
	>
		<svg
			xmlns="http://www.w3.org/2000/svg"
			class="w-4 h-4"
			viewBox="0 0 24 24"
			fill="none"
			stroke="currentColor"
			stroke-width="2"
			stroke-linecap="round"
			stroke-linejoin="round"
		>
			<path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"></path>
			<path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"></path>
		</svg>
		<span>Corrupti</span>
	</a>
	<a
		class="flex items-center flex-shrink-0 px-5 py-3 space-x-2 border-b"
		rel="noopener noreferrer"
		href="#"
		[ngClass]="['border' + plainInv, 'text' + plainInv]"
	>
		<svg
			xmlns="http://www.w3.org/2000/svg"
			class="w-4 h-4"
			viewBox="0 0 24 24"
			fill="none"
			stroke="currentColor"
			stroke-width="2"
			stroke-linecap="round"
			stroke-linejoin="round"
		>
			<polygon
				points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"
			></polygon>
		</svg>
		<span>Excepturi</span>
	</a>
	<a
		class="flex items-center flex-shrink-0 px-5 py-3 space-x-2 border-b"
		rel="noopener noreferrer"
		href="#"
		[ngClass]="['border' + plainInv, 'text' + plainInv]"
	>
		<svg
			xmlns="http://www.w3.org/2000/svg"
			class="w-4 h-4"
			viewBox="0 0 24 24"
			fill="none"
			stroke="currentColor"
			stroke-width="2"
			stroke-linecap="round"
			stroke-linejoin="round"
		>
			<circle cx="12" cy="12" r="10"></circle>
			<polygon points="16.24 7.76 14.12 14.12 7.76 16.24 9.88 9.88 16.24 7.76"></polygon>
		</svg>
		<span>Consectetur</span>
	</a>
</div>
